<template>
	<u-toast ref="uToast"></u-toast>
	<view class="Home">
		<!-- 状态栏 -->
		<view class="NavTobar">
			<view style="height: 80rpx"></view>
			<!-- 安全高度 -->
			<template class="flex_al_cen_ju_bet">
				<view class="User flex_al_cen_ju_bet">
					<view class="avatar" @click="baseDataShow.MeShow = true">
						<!--                        <image mode="scaleToFill"-->
						<!--                               :src="nowstatus.infoData.userAvatar == null? defaultAvatar: nowstatus.infoData.userAvatar"/>-->
						<u-image width="70rpx" height="70rpx" :src="
                nowstatus.infoData.userAvatar == null
                  ? defaultAvatar
                  : nowstatus.infoData.userAvatar
              " mode="scaleToFill" bgColor="#EFEFEF" loadingIcon="" radius="50%" :lazy-load="true"></u-image>
					</view>
					<!-- 状态点 -->
					<view class="state flex_al_cen_ju_bet">
						<view v-if="nowstatus.infoData.userWorkStatus == 0" class="dian boder_r_50"></view>
						<text v-if="nowstatus.infoData.userWorkStatus == 0">上线中</text>
						<view v-if="nowstatus.infoData.userWorkStatus == 1" class="erroNet boder_r_50"></view>
						<text v-if="nowstatus.infoData.userWorkStatus == 1">已下线</text>
					</view>
				</view>
				<view class="SwitchType flex_al_cen_ju_bet">
					<view class="active" v-for="(item, index) in switchTypelist" :key="index">{{ item.name }} ({{
              item.name == "外卖"
                ? newOrders.NewOrders.order0
                : newOrders.NewOrders.order1
            }})
					</view>
				</view>
				<!--<view class="SwitchType flex_al_cen_ju_bet">-->
				<!--	<view v-for="(item, index) in switchTypelist" :key="index" @click="SwitchType(index)"-->
				<!--		:class="crowIndex == index ? 'active' : ''">{{ item.name }}-->
				<!--		({{item.name=='外卖'? newOrders.NewOrders.order0 : newOrders.NewOrders.order1}})-->
				<!--	</view>-->
				<!--</view>-->
			</template>
			<u-tabs lineWidth="20" :activeStyle="activeStyle" :inactiveStyle="inactiveStyle" lineColor="#FF0000"
				:scrollable="false" :list="Tabs.list" @change="TabsClick" :current="Tabs.current"></u-tabs>
		</view>
		<!-- 消息列表 -->
		<Room v-if="infoList"></Room>
		<!-- 订单列表 -->
		<scroll-view v-else :class="orderlist.list == 0 ? ' scroll_Y_NOHeight' : 'scroll_Y'" scroll-y
			v-if="orderlist.list" @scrolltolower="toLower">
			<view class="list_box_prompt" v-if="orderlist.list != 0">
				<image class="prompt_icon"
					src="https://wms-1306213729.cos.ap-beijing.myqcloud.com/wms_app/horn_icon.png" mode=""></image>
				订单进行期间顾客、商家会和您使用虚拟号进行联系，请注意接听
			</view>
			<!-- 外卖订单 和 跑腿订单-->
			<!--<view v-if="takeOutGoodsType.distributionType == 0 && orderlist.list.length != 0">-->
			<view v-if="orderlist.list.length != 0">
				<Order :Type="takeOutGoodsType.statusType" @setSkipModel="setSkipModel"
					v-if="takeOutGoodsType.distributionType == 0" :orderType="changeType.Type"
					:AddConfig="orderlist.list" :orderlist="orderlist.list" @makeOrder="resetmakeOrder"
					@Graban="GrabanOrder" @changeTab="TabsClick" @clickIsShow="clickIsShow"
					@setSendCodeModel="setSendCodeModel" @getPhoneList="getPhoneList">
				</Order>
			</view>
			<!-- 跑腿订单（外卖跑腿订单合一起了） -->
			<!--<runErrandsOrder v-else @setSkipModel="setSkipModel" :Type="takeOutGoodsType.statusType"-->
			<!--	:orderType="changeType.Type" :AddConfig="orderlist.list" @setSendCodeModel="setSendCodeModel"-->
			<!--	@changeTab="TabsClick" :orderlist="orderlist.list" @makeOrder="resetmakeOrder" @Graban="GrabanOrder"-->
			<!--	@clickIsShow='clickIsShow' @getPhoneList='getPhoneList'>-->
			<!--</runErrandsOrder>-->
		</scroll-view>
		<!-- 缺省页 -->
		<DefaultPage v-if="orderlist.list.length == 0 && !infoList" :type="'notCommodity'" :tips="'暂无订单'"></DefaultPage>

		<!-- 底部刷新 -->
		<FooterType :Type="takeOutGoodsType.statusType" @click="loadList"></FooterType>
		<!-- 个人信息 -->
		<MePoP v-if="baseDataShow.Meswitch != null" :MeShow="baseDataShow.MeShow"
			@MeShowclose="baseDataShow.MeShow = false" @swtichChange="switchReset" @setSkipModel2="setSkipModel2">
		</MePoP>
	</view>
	<!-- 实名认证模态框 -->
	<u-modal :show="baseDataShow.SkipModel" title="尚未实名认证" confirmText="确定" :showCancelButton="true"
		cancelColor="#AAAAAA" confirmColor="#000" @cancel="baseDataShow.SkipModel = false" @confirm="confirmSkipModel">
		<view style="color: #0c22b0">实名认证后才可以接单</view>
	</u-modal>
	<!-- 取 收 确认码 -->
	<u-modal :show="baseDataShow.sendCode" :title="tipText.titleText" confirmText="确定" :showCancelButton="true"
		class="cdoeInput" cancelColor="#AAAAAA" :confirmColor="baseDataShow.colorShow == true ? '#2979ff' : '#000'"
		@cancel="cancelSendCode" @confirm="confirmSendCode">
		<view class="modeCode">
			<!-- <u-code-input
        :borderColor="
          baseDataShow.codeTextShow == false ? '#2141f4' : '#f56c6c'
        "
        v-model="takeGoodInfo.pickCode"
        :disabledDot="true"
        @change="changeOrderCode"
        mode="box"
        dot
        :maxlength="6"
        hairline
      ></u-code-input> -->
			<view class="tip_text" v-if="baseDataShow.codeTextShow">
				<u-text type="error" :text="tipText.codeText"></u-text>
			</view>
		</view>
	</u-modal>

	<!-- 转单弹出层 -->
	<c-refund-bottom-popup :isShow="isShow" popupTitle="转单原因" @clickConfirm="clickConfirm" @isShowFalse="isShowFalse"
		:radiolist="radiolist"></c-refund-bottom-popup>

	<!-- 电话联系 弹出层 -->
	<c-phone-mask-list :orderId="phoneBtnList.orderId" :phone="phoneBtnList.riderPhone" :mapType="false"
		:phoneListShow="phoneListShow" :phoneBtnList="phoneBtnList.arr" @btnCancel="btnCancel"></c-phone-mask-list>
</template>

<script setup lang="ts">
	/**    订单类型  orderType {0,1}  0 外卖  1  跑腿
 *     订单状态 Type{0,1,2}  0 新任务  1 待配送    2 配送中
 */
	import DefaultPage from "@/components/DefaultPage.vue";
	import { reactive, getCurrentInstance, ref } from "vue";
	import { onLoad, onHide, onUnload, onShow } from "@dcloudio/uni-app";
	import { getLocation } from "@/utlis/uni_api";
	import FooterType from "./components/FooterType.vue"; //刷新
	import Order from "./components/Order.vue"; //外卖订单列表
	import runErrandsOrder from "./components/runErrandsOrder.vue"; //跑腿订单列表
	import MePoP from "./MePoP.vue"; // 个人信息左弹出层
	import { useStore, NewOrder } from "@/Pinia/index";

	// Hooks
	import Home from "@/Hooks/Home/Home";
	// 引入组件
	const defaultAvatar = "../../static/images/pulice/defaultAvatar.png";
	const { proxy } = getCurrentInstance() as any;
	const {
		Tabs,
		TabsClick,
		toLower,
		baseDataShow,
		takeOutGoodsType,
		SwitchType,
		takeOutGoods,
		orderlist,
		GrabanOrder,
		crowIndex,
		switchTypelist,
		changeType,
		getOrderCount,
		confirmSkipModel,
		confirmSendCode,
		loadList,
		resetmakeOrder,
		switchReset,
		setSkipModel,
		setSendCodeModel,
		changeOrderCode,
		takeGoodInfo,
		tipText,
		cancelSendCode,
		isShow,
		orderId,
		radiolist,
		clickConfirm,
		isShowFalse,
		clickIsShow,
		getPhoneList,
		phoneBtnList,
		btnCancel,
		phoneListShow,
		setSkipModel2,
		infoList,
	} = Home(proxy);
	// 获取骑手信息
	const nowstatus = useStore();
	const newOrders = NewOrder();

	const nav = () => {
		uni.navigateTo({
			url: "/pages/Order/HomeOrderDetails",
		});
	};

	onShow(() => {
		loadList();
	});

	//切换订单赛选
	onLoad((options) => { });

	// Tabs样式
	const activeStyle = reactive({
		transform: "scale(1.05)",
		fontWeight: "bold",
		fontSize: "25rpx",
		color: "#000",
	});

	const inactiveStyle = reactive({
		fontSize: "25rpx",
		color: "#000",
	});

	let time = null;
	let num = 0;
	const TimeFn = () => {
		if (num == 5) {
			num = 0;
			fn((res ?: string) => {
				console.log(res);
				TimeFn();
			});
		} else {
			time = setTimeout(() => {
				num++;
				TimeFn();
				console.log("递归触发", num);
			}, 1000);
		}
	};
	let numShow = false;
	let num1 = 0;
	const fn = (callback : Function) => {
		fn2()
			.then((res) => {
				num1 = 0;
				callback(res);
			})
			.catch((err) => {
				console.log(err, num1);
				setTimeout(() => {
					num1++;
					fn(callback);
				}, 1000);
			});
	};
	const fn2 = () => {
		if (num1 == 5) {
			return Promise.resolve("成功");
		} else {
			return Promise.reject("失败");
		}
	};
	// TimeFn();
</script>
<style lang="scss" scoped>
	@import "../../static/css/Home/Home.scss";

	::v-deep .codeInput {
		.u-code-input__item {
			border-radius: 20rpx;
		}
	}
</style>
<style>
	body {
		background: #f6f6f6;
	}
</style>